<template>
	<view class="wrap">
		<view class="search">
			<u-search v-model="keywords" @custom="search" @search="search"></u-search>
		</view>
		<u-tabs :list="list" :is-scroll="false" :current="current" @change="change"></u-tabs>
		<view v-if="current === 0">
			<scroll-view class="scroll-list msg-list-item" scroll-y="true">
				<view class="msg-time">7月08日 10:05</view>
				<u-card class="task-list-item" :border="false" padding="20" margin="10rpx 20rpx" @click="navTo('/pages/sys/msg/feedback-item')">
					<view slot="head" style="display: flex;align-items: center;justify-content: space-between;">
						<view style="display: flex;align-items: center;font-size: 30rpx;"><image class="user-images" src="/static/aidex/images/user06.png"></image>李毅的反馈</view><view style="color: #999999;font-size: 22rpx;">2024年7月08日</view>
					</view>
					<view class="" slot="body">
						<u-row gutter="16">
							<u-col span="12">
								<view class="apply-text"><span>反馈标题：</span>关于图书馆活动反馈</view>
							</u-col>
							<u-col span="12">
								<view class="apply-text"><span>反馈内容：</span>活动内容丰富多样，包括团队拓展游戏、才艺展示、抽奖环节等，每个环节都充满了欢声笑语，展现了员工们的活力和团队精神。</view>
							</u-col>
						</u-row>
					</view>
					<view class="apply-list-foot" slot="foot" style="text-align: right;color: #fcbd71;">
						未读
					</view>
				</u-card>
				<view class="msg-time">7月06日 15:32</view>
				<u-card class="task-list-item" :border="false" padding="20" margin="10rpx 20rpx">
					<view slot="head" style="display: flex;align-items: center;justify-content: space-between;">
						<view style="display: flex;align-items: center;font-size: 30rpx;"><image class="user-images" src="/static/aidex/images/user06.png"></image>李毅的反馈</view><view style="color: #999999;font-size: 22rpx;">2024年7月06日</view>
					</view>
					<view class="" slot="body">
						<u-row gutter="16">
							<u-col span="12">
								<view class="apply-text"><span>反馈标题：</span>图书馆活动反馈</view>
							</u-col>
							<u-col span="12">
								<view class="apply-text"><span>反馈内容：</span>活动过程中也存在一些不足之处，部分同学反映活动通知不够及时。</view>
							</u-col>
						</u-row>
					</view>
					<view class="apply-list-foot" slot="foot" style="text-align: right;color: #fcbd71;">
						未读
					</view>
				</u-card>
				<u-divider>已经到底了</u-divider>
			</scroll-view>
		</view>
		<view v-if="current === 1">
			<scroll-view class="scroll-list msg-list-item" scroll-y="true">
				<view class="msg-time">11月08日 10:05</view>
				<u-card class="task-list-item" :border="false" padding="20" margin="10rpx 20rpx">
					<view slot="head" style="display: flex;align-items: center;justify-content: space-between;">
						<view style="display: flex;align-items: center;font-size: 30rpx;"><image class="user-images" src="/static/aidex/images/user06.png"></image>李毅的反馈</view><view style="color: #999999;font-size: 22rpx;">2024年10月24日</view>
					</view>
					<view class="" slot="body">
						<u-row gutter="16">
							<u-col span="12">
								<view class="apply-text"><span>反馈标题：</span>活动反馈</view>
							</u-col>
							<u-col span="12">
								<view class="apply-text"><span>反馈内容：</span>增加互动环节，让员工们有更多的机会交流和分享，增强团队凝聚力。</view>
							</u-col>
						</u-row>
					</view>
					<view class="apply-list-foot" slot="foot" style="text-align: right;color: #58ca93;">
						已读
					</view>
				</u-card>
				<u-divider>已经到底了</u-divider>
			</scroll-view>
		</view>
		<view v-if="current === 2">
			<scroll-view class="scroll-list msg-list-item" scroll-y="true">
				<u-card class="task-list-item-all" :border="false" padding="20" margin="25rpx 20rpx">
					<view slot="head" style="display: flex;align-items: center;justify-content: space-between;">
						<view style="display: flex;align-items: center;font-size: 30rpx;"><image class="user-images" src="/static/aidex/images/user06.png"></image>李毅的反馈</view><view style="color: #999999;font-size: 22rpx;">2024年10月24日</view>
					</view>
					<view class="" slot="body">
						<u-row gutter="16">
							<u-col span="12">
								<view class="apply-text"><span>反馈标题：</span>图书馆活动反馈</view>
							</u-col>
							<u-col span="12">
								<view class="apply-text"><span>反馈内容：</span>活动内容丰富多样，包括团队拓展游戏、才艺展示、抽奖环节等，每个环节都充满了欢声笑语，展现了员工们的活力和团队精神。</view>
							</u-col>
						</u-row>
					</view>
					<view class="apply-list-foot" slot="foot" style="text-align: right;color: #fcbd71;">
						未读
					</view>
				</u-card>
				<u-card class="task-list-item-all" :border="false" padding="20" margin="25rpx 20rpx">
					<view slot="head" style="display: flex;align-items: center;justify-content: space-between;">
						<view style="display: flex;align-items: center;font-size: 30rpx;"><image class="user-images" src="/static/aidex/images/user06.png"></image>李毅的反馈</view><view style="color: #999999;font-size: 22rpx;">2024年10月24日</view>
					</view>
					<view class="" slot="body">
						<u-row gutter="16">
							<u-col span="12">
								<view class="apply-text"><span>反馈标题：</span>图书馆活动反馈</view>
							</u-col>
							<u-col span="12">
								<view class="apply-text"><span>反馈内容：</span>活动过程中也存在一些不足之处，部分同学反映活动通知不够及时。</view>
							</u-col>
						</u-row>
					</view>
					<view class="apply-list-foot" slot="foot" style="text-align: right;color: #fcbd71;">
						未读
					</view>
				</u-card>
				<u-card class="task-list-item-all" :border="false" padding="20" margin="25rpx 20rpx">
					<view slot="head" style="display: flex;align-items: center;justify-content: space-between;">
						<view style="display: flex;align-items: center;font-size: 30rpx;"><image class="user-images" src="/static/aidex/images/user06.png"></image>李毅的反馈</view><view style="color: #999999;font-size: 22rpx;">2024年10月24日</view>
					</view>
					<view class="" slot="body">
						<u-row gutter="16">
							<u-col span="12">
								<view class="apply-text"><span>反馈标题：</span>活动反馈</view>
							</u-col>
							<u-col span="12">
								<view class="apply-text"><span>反馈内容：</span>增加互动环节，让员工们有更多的机会交流和分享，增强团队凝聚力。</view>
							</u-col>
						</u-row>
					</view>
					<view class="apply-list-foot" slot="foot" style="text-align: right;color: #58ca93;">
						已读
					</view>
				</u-card>
				<u-divider>已经到底了</u-divider>
			</scroll-view>
		</view>
	</view>
</template>

<script>
export default {
	data() {
		return {
			list: [{
				name: '未读'
			}, {
				name: '已读',
			}, {
				name: '全部',
			}],
			current: 0,
			keywords: '',
		}
	},
	methods: {
		change(index) {
			this.current = index;
		},
		navTo(url) {
			uni.navigateTo({
				url: url
			});
		},
	}
}
</script>

<style>
@import '../../../common/uni.css';
page {
	background-color: #f5f5f5;
}

.msg-time{
	font-size: 26rpx;
	padding: 5px 0;
	color: #999999;
	text-align: center;
}

.user-images{
	width: 28px;
	height:28px;
	margin-right: 8px;
}

.apply-text{
	font-size: 28rpx;
	color: #333333;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	
	span{
		color: #999999;
	}
}

.task-list-item-all {

}
</style>